/**
 * Created by Administrator on 2017/3/15.
 */
import React, { Component } from 'react';
import { Radio } from 'antd';
import { Checkbox  } from 'antd';
import '../../css/revise.css';
// const CheckboxGroup = Checkbox.Group;
const RadioGroup = Radio.Group;
const $ = require('jquery');
class TikuAdd extends Component{
    state={
        difficulty:'0',
        result:[],
        notes:"",
        contents:"",
        itemJson:['A','B','C','D'],
        problemType:'0',
        list:['1']
    };
    /**
     *
     * @param type 要修改的状态名称
     * @param e
     */
    onChange = (type,e) => {
        if(type==='problemType'){
            this.setState({
                [type]: e.target.value,
                result:[],
                itemJson:['A','B','C','D']
            });
        }else{
            this.setState({
                [type]: e.target.value
            });
        }
    };
    KeepBtn(){
        this.props.addBtn();
    }
    // onChange1=(checkedValues)=>{
    //     this.setState({result:checkedValues})
    // };
    render(){
        var _this=this;
        return <form id="formobj">
            <div className="J_bj">
                <h2>新增题目</h2>
                {_this.state.list.map(function (p,i) {
                    return  <div className="J_choose" key={i}>
                        <div className="J_dir">
                            <span><em>*</em> 目录：</span>
                            <select name="" >
                                <option value="">一级目录</option>
                            </select>
                        </div>
                        <div className="J_type">
                            <span><em>*</em> 题型：</span>
                            <select value={_this.state.problemType} onChange={_this.onChange.bind(this,'problemType')}>
                                <option value='0'>单选题</option>
                                <option value='1'>多选题</option>
                                <option value='2'>判断题</option>
                            </select>
                            <div className="J_grade">
                                <span>难度等级：</span>
                                <RadioGroup onChange={_this.onChange.bind(this,'difficulty')} value={_this.state.difficulty}>
                                    <Radio value='0'>易</Radio>
                                    <Radio value='1'>中</Radio>
                                    <Radio value='2'>难</Radio>
                                </RadioGroup>
                            </div>
                        </div>
                        <div className="J_topic">
                            <span><em>*</em> 题干：</span>
                            <div>
                                <textarea value={_this.state.contents} onChange={_this.onChange.bind(this,'contents')}></textarea>
                            </div>
                            <div className="J_hint"><span></span>题干不能为空</div>
                        </div>
                        <div className="J_option" >
                        <span>
                            <em>*</em> 选项
                            <strong>{_this.state.problemType==='0'?'单选题选项个数范围3到10，正确选项个数为1':"多选题选项个数范围4到10，正确选项个数不少于2"}</strong>
                        </span>
                            {_this.state.itemJson.map(function (result,index) {
                                return   <div key={index} value={index}>
                                    <span><em>{result}</em>：</span>
                                    <div>
                                        <textarea></textarea>
                                    </div>
                                    <div className="J_handle">
                                        <i className="J_up"></i>
                                        <i className="J_down"></i>
                                        <i className="J_delete"></i>
                                    </div>
                                    <strong className="J_hint"><span></span> <em>选项不能为空</em></strong>
                                </div>
                            })}
                        </div>
                        <div className="J_add_option" >
                            <em>+</em> <span> 添加一个选项</span>
                        </div>
                        <div className="J_key">
                            <span><em>*</em> 答案：</span>
                            {
                                _this.state.problemType==='1'?
                                   // <CheckboxGroup options={_this.state.itemJson} value={_this.state.result} onChange={_this.onChange1} />
                                    _this.state.itemJson.map(function (result,index) {
                                        var a=false;
                                       _this.state.result.map(function (data,i) {
                                           if(data===result){
                                                a=true;
                                           }
                                        });
                                        return <Checkbox key={index} defaultChecked={a}>{result}</Checkbox>
                                    })
                                    :_this.state.problemType==='0'?
                                        <RadioGroup onChange={_this.onChange.bind(this, 'result')} value={_this.state.result}>
                                            {_this.state.itemJson.map(function (result, index) {
                                                return <Radio key={index} value={result}>{result}</Radio>
                                            })}
                                        </RadioGroup>
                                        : <RadioGroup onChange={_this.onChange.bind(this, 'result')} value={_this.state.result}>
                                            <Radio  value={'0'}>错</Radio>
                                            <Radio  value={'1'}>对</Radio>
                                        </RadioGroup>
                            }
                            <div className="J_hint"><span></span> {_this.state.problemType==='1'?'多选题答案不能少于2个':'请选择正确答案'}</div>
                        </div>
                        <div className="J_analysis">
                            <span><em>*</em> 解析：</span>
                            <div>
                                <textarea value={_this.state.notes} onChange={_this.onChange.bind(this,'notes')}></textarea>
                            </div>
                        </div>
                        <div className="J_title_down">
                            <h4></h4>
                            <div className="J_contents"></div>
                            <div className="J_title_down_option">
                            </div>
                            <div className="J_answer">
                                <div><span>答案：</span> <span className="J_answer_key"></span></div>
                                <div className="J_analysis"><span>解析：</span><div></div></div>
                            </div>
                        </div>
                    </div>
                })}
                <div className="J_add_titles">
                    <span><em>+</em> 再新增一题</span>
                </div>
                <div className="J_func">
                    <div>
                        <span className="J_preview">预览</span>
                        <span className="J_save" onClick={this.KeepBtn.bind(this)}>保存</span>
                    </div>
                </div>
                <div className="J_model">
                    <div>
                        <span>操作成功</span>
                    </div>
                </div>
            </div>
        </form>
    }
    componentDidMount(){
        var _this=this;
        var problemsQueryList=[];
        // var _nowtitle=[];
        var base64EncodeChars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/";
        /***base64编码**/
        function Base64encode(str) {
            var out, i, len;
            var c1, c2, c3;

            len = str.length;
            i = 0;
            out = "";
            while(i < len) {
                c1 = str.charCodeAt(i++) & 0xff;
                if(i === len)
                {
                    out += base64EncodeChars.charAt(c1 >> 2);
                    out += base64EncodeChars.charAt((c1 & 0x3) << 4);
                    out += "==";
                    break;
                }
                c2 = str.charCodeAt(i++);
                if(i ===len)
                {
                    out += base64EncodeChars.charAt(c1 >> 2);
                    out += base64EncodeChars.charAt(((c1 & 0x3)<< 4) | ((c2 & 0xF0) >> 4));
                    out += base64EncodeChars.charAt((c2 & 0xF) << 2);
                    out += "=";
                    break;
                }
                c3 = str.charCodeAt(i++);
                out += base64EncodeChars.charAt(c1 >> 2);
                out += base64EncodeChars.charAt(((c1 & 0x3)<< 4) | ((c2 & 0xF0) >> 4));
                out += base64EncodeChars.charAt(((c2 & 0xF) << 2) | ((c3 & 0xC0) >>6));
                out += base64EncodeChars.charAt(c3 & 0x3F);
            }
            return out;
        }
        function utf16to8(str) {
            var out, i, len, c;

            out = "";
            len = str.length;
            for(i = 0; i < len; i++) {
                c = str.charCodeAt(i);
                if ((c >= 0x0001) && (c <= 0x007F)) {
                    out += str.charAt(i);
                } else if (c > 0x07FF) {
                    out += String.fromCharCode(0xE0 | ((c >> 12) & 0x0F));
                    out += String.fromCharCode(0x80 | ((c >>  6) & 0x3F));
                    out += String.fromCharCode(0x80 | ((c >>  0) & 0x3F));
                } else {
                    out += String.fromCharCode(0xC0 | ((c >>  6) & 0x1F));
                    out += String.fromCharCode(0x80 | ((c >>  0) & 0x3F));
                }
            }
            return out;
        }
        var letterIndex = "A,B,C,D,E,F,G,H,I,J".split(',');//x选项名称
        /**保存修改的数据**/
        $(".J_save").click(function () {
            var _openIndex=$(".J_bj>div").index($('.J_open'));
            var itemList = [];
            debugger
          if(_openIndex===-1){
              var _hint=true;
              if(_this.state.problemType!=='2'){
                  $('.J_add_titles').prev().find(".J_option div textarea").each(function (index) {
                      if($.trim($(this).val())===""){//判断是否为空
                          _hint=false;
                          $(this).parent().siblings('.J_hint').css('visibility','visible');
                          $(this).parent().siblings('.J_hint').children('em').text('选项不能为空');
                          $(this).css('borderColor','#FF4141');
                      }else{
                          var _value=$.trim($(this).val());
                          if(index!==0){//判断选项是否相同
                              var _arr=$('.J_add_titles').prev().find(".J_option div textarea").slice(0,index);
                              for(var i=0;i<_arr.length;i++){
                                  if($.trim(_arr.eq(i).val())===_value){
                                      $(this).parent().siblings('.J_hint').css('visibility','visible');
                                      $(this).parent().siblings('.J_hint').children('em')
                                          .text('与选项'+_arr.eq(i).parent().siblings('span').children('em').text()+'重复');
                                      $(this).css('borderColor','#FF4141');
                                      _hint=false;
                                  }
                              }
                          }
                      }
                      var item = {};
                      item.itemIndex = index;//序号、排序
                      item.numberIndex = letterIndex[index];//序号文本
                      item.content = $(this).val();//内容
                      itemList.push(item);
                  });
              }
              /***如果是多选题，答案只有一个，则提示错误信息，不保存***/
              if(_this.state.problemType==='1'&&$('.J_add_titles').prev().find(".J_key input:checked").length<2){
                  $(".J_key .J_hint").css('visibility','visible');
                  _hint=false;
              }
              if($('.J_add_titles').prev().find(".J_key input:checked").length<1){//单选或判断，没选，则提示
                  _hint=false;
                  $(".J_key .J_hint").css('visibility','visible');
              }
              if($.trim($('.J_add_titles').prev().find('.J_topic textarea').val())===""){//如果题干为空，则提示错误信息
                  _hint=false;
                  $(".J_topic .J_hint").css('visibility','visible');
                  $('.J_topic textarea').css('borderColor','#FF4141');
              }
              if(!_hint){
                  $('.J_add_titles').prev().css('borderColor','#FF4141');
                  return
              }
              if(_this.state.problemType==='1'){//多选的时候拿到答案
                  var _result1=[];
                  $('.J_add_titles').prev().find('.J_key input').each(function (index) {
                      if($(this).prop('checked')){
                          var _result=$(this).parent().siblings('span').text();
                          _result1.push(_result);
                      }
                  });
                  _this.state.result=_result1;
              }
              _this.state.itemJson=JSON.stringify(itemList);//转化为json对象
              // _this.state.itemJson=itemList;//转化为json对象
              delete  _this.state.list;//删除属性
              problemsQueryList.push( _this.state);
          }else{
              $('.J_open').find('.J_option textarea').each(function (index) {//拿到选项内容
                  var item = {};
                  item.itemIndex = index;//序号、排序
                  item.numberIndex = letterIndex[index];//序号文本
                  item.content = $(this).val();//内容
                  itemList.push(item);
              });
              if(_this.state.problemType==='1'){//多选的时候拿到答案
                  var _result=[];
                  $('.J_open').find('.J_key input').each(function (index) {
                      if($(this).prop('checked')){
                          var _result=$(this).parent().siblings('span').text();
                          _result.push(_result);
                      }
                  });
                  _this.state.result=_result;
              }
              const _state=$.extend({}, _this.state);
              problemsQueryList[_openIndex]=_state;
              problemsQueryList[_openIndex].itemJson=JSON.stringify(itemList);
              yanzhen();//保存时验证
              var _errIndex=$(".J_bj>div").index($('.J_err'));//保存时验证
              if(_errIndex!==-1){
                  return
              }
          }
          $.each(problemsQueryList,function (i,result) {
            if(result.problemType==='2'){
                result.itemJson='';
            }else {
                result.itemJson=JSON.parse( result.itemJson);
            }
            delete result.list;
          });
            var _list = {};
            for (var i = 0; i < problemsQueryList.length; i++) {
                _list["problemsQueryList[" + i + "].result"] = problemsQueryList[i].result.toString();
                _list["problemsQueryList[" + i + "].contents"] =Base64encode(utf16to8(problemsQueryList[i].contents));
                // _list["problemsQueryList[" + i + "].itemJson"] = problemsQueryList[i].itemJson;
                _list["problemsQueryList[" + i + "].problemType"] = problemsQueryList[i].problemType;
                _list["problemsQueryList[" + i + "].difficulty"] = problemsQueryList[i].difficulty;
                _list["problemsQueryList[" + i + "].notes"] =Base64encode(utf16to8(problemsQueryList[i].notes));
                for (var j = 0; j < problemsQueryList[i].itemJson.length; j++) {
                    _list["problemsQueryList[" + i + "].listOption["+j+"].numberIndex"] = problemsQueryList[i].itemJson[j].numberIndex;
                   _list["problemsQueryList[" + i + "].listOption["+j+"].content"] =Base64encode(utf16to8(problemsQueryList[i].itemJson[j].content));
                    _list["problemsQueryList[" + i + "].listOption["+j+"].itemIndex"] = problemsQueryList[i].itemJson[j].itemIndex;
                }
            }
            $.ajax({
                type:"POST",
               // contentType: "application/text",
                //url:"http://192.168.2.9:8080/learn/s/resources/hProblems/batchSave",
                url:"http://192.168.2.169:8080/s/resources/hProblems/batchSave",
                data:_list,
                success:function (data) {
                    if(data.status==="OK"){
                        var ids="1,2,3";
                        $.post("http://192.168.2.9:8080/learn/s/resources/hProblems/ select_list",{"ids":ids}, function(data) {
                            console.log(data);
                            let pJson =  JSON.stringify(data.data);
                            console.log(pJson);
                            sessionStorage.setItem("pJson",pJson);

                        });
                    }
                }
            })
        });
        /**验证是否为空**/
        function yanzhen() {
            // var _hint;
            // $('.J_choose').each(function () {
            //    $(this).find(" .J_option div textarea").each(function (index) {
            //         if($.trim($(this).val())===""){
            //             _hint=false;
            //             $(this).parent().siblings('.J_hint').css('visibility','visible');
            //             $(this).css('borderColor','#FF4141');
            //         }
            //        console.log($(this).val())
            //     });
            //     if(_this.state.problemType==='1'&&$(this).find(".J_key input:checked").length<2){
            //         $(".J_key .J_hint").css('visibility','visible');
            //         _hint=false;
            //     }else{
            //         $(this).find(".J_key .J_hint").css('visibility','hidden');
            //     }
            //     if($(this).find(".J_key input:checked").length<1){//单选或判断，没选，则提示
            //         _hint=false;
            //         $(this).find(".J_key .J_hint").css('visibility','visible');
            //     }else{
            //         $(this).find(".J_key .J_hint").css('visibility','hidden');
            //     }
            //     //如果题干为空，则提示错误信息
            //     if($.trim($(this).find('.J_topic textarea').val())===""){
            //         _hint=false;
            //         $(this).find(".J_topic .J_hint").css('visibility','visible');
            //         $(this).find('.J_topic textarea').css('borderColor','#FF4141');
            //     }
            //     if(!_hint){
            //         $(this).css('borderColor','#FF4141');
            //     }else{
            //         $(this).css('borderColor','#cccccc');
            //     }
            // });
            $.each(problemsQueryList,function (i,n) {
                var _hints=true;
                if(n.problemType!=='2'){
                    var _item=JSON.parse(n.itemJson);
                    $.each(_item,function (indexs,result) {
                        if($.trim(result.content)===""){//为空则显示提示语
                            _hints=false;
                            $(".J_bj>div:eq("+i+")").find(" .J_option div textarea:eq("+indexs+")")
                                .parent().siblings('.J_hint').css('visibility','visible');
                            $(".J_bj>div:eq("+i+")").find(" .J_option div textarea:eq("+indexs+")")
                                .css('borderColor','#FF4141');
                        }else{
                            if(indexs!==0){//判断选项是否相同
                                var _arr=_item.slice(0,indexs);
                                for(var j=0;j<_arr.length;j++){
                                    if($.trim(_arr[j].content)===$.trim(result.content)){
                                        $(".J_bj>div:eq("+i+")").find(" .J_option div textarea:eq("+indexs+")")
                                            .parent().siblings('.J_hint').css('visibility','visible');
                                        $(".J_bj>div:eq("+i+")").find(" .J_option div textarea:eq("+indexs+")")
                                            .css('borderColor','#FF4141');
                                        $(".J_bj>div:eq("+i+")").find(" .J_option div .J_hint:eq("+indexs+")")
                                            .children('em').text('与选项'+$(".J_bj>div:eq("+i+")").find(" .J_option div textarea:eq("+j+")").parent().siblings('span').text().slice(0,1)+'重复');
                                        _hints=false;
                                    }
                                }
                            }
                        }

                    });
                }
                if($.trim(n.contents)===''){
                    _hints=false;
                    $(".J_bj>div:eq("+i+")").find(".J_topic .J_hint").css('visibility','visible');
                    $(".J_bj>div:eq("+i+")").find('.J_topic textarea').css('borderColor','#FF4141');
                }
                if(n.problemType==='1'&&n.result.length<2){
                    $(".J_bj>div:eq("+i+")").find(".J_key .J_hint").css('visibility','visible');
                            _hints=false;
                } else if(n.problemType!=='1'&& n.result.length<1){//单选或判断，没选，则提示
                    _hints=false;
                    $(".J_bj>div:eq("+i+")").find(".J_key .J_hint").css('visibility','visible');
                }else{
                    $(".J_bj>div:eq("+i+")").find(".J_key .J_hint").css('visibility','hidden');
                }
                if(_hints){
                    $(".J_bj>div:eq("+i+")").css('borderColor','#cccccc');
                    // console.log( $(".J_bj>div:eq("+i+")"))
                    $(".J_bj>div:eq("+i+")").removeClass('J_err');
                }else{
                    $(".J_bj>div:eq("+i+")").css('borderColor','#FF4141');
                    $(".J_bj>div:eq("+i+")").addClass('J_err');
                }

            });
        }
        Event();
        function Event() {
            /**改变题型，选项显示/隐藏**/
            $(".J_bj").on('click','.J_choose .J_type select',function () {
                if(_this.state.problemType==='2'){
                    $(this).parent().siblings('.J_option').css('display','none');
                    $(this).parent().siblings('.J_add_option').css('display','none');
                }else {
                    $(this).parent().siblings('.J_option').css('display','block');
                    $(this).parent().siblings('.J_add_option').css('display','block');
                }
            });
            /**删除选项事件**/
            $(".J_bj ").on('click', '.J_option .J_delete', function () {
                var _length = _this.state.itemJson.length;
                if (_length === 3 && _this.state.problemType === '0') {
                    return
                } else if (_length === 4 && _this.state.problemType === '1') {
                    return
                } else {
                    var _index=$(this).parent().parent().attr('value');
                    var _child=$(this).parent().parent().parent().find('textarea').splice(_index);
                    $.each(_child,function (i,result) {
                        $(this).val($(this).parent().parent().next().find('textarea').val());
                    });
                    var _itemJson = _this.state.itemJson;
                    _itemJson.splice(1, 1);
                    // console.log(_itemJson)
                    for (var i = 0; i < _itemJson.length; i++) {
                        _itemJson[i] = letterIndex[i]
                    }
                    _this.setState({
                        itemJson: _itemJson
                    });

                }
            });
            /***向上移动**/
            $(".J_bj").on('click', '.J_option .J_up', function () {
                var nowValue = $(this).parent().siblings('div').children('textarea').val();
                var node = $(this).parent().parent().prev()[0].nodeName;
                var prevValue;
                if (node === 'SPAN') {
                    prevValue = $(".J_option div textarea:last").val();
                    $(".J_option div textarea:last").val(nowValue);
                } else {
                    prevValue = $(this).parent().parent().prev().find('textarea').val();
                    $(this).parent().parent().prev().find('textarea').val(nowValue);
                }
                $(this).parent().siblings('div').children('textarea').val(prevValue);
            });
            /**向下移动**/
            $(".J_bj ").on('click', '.J_option .J_down', function () {
                var nowValue = $(this).parent().siblings('div').children('textarea').val();
                var next = $(this).parent().parent().next();
                var nextValue;
                if (next[0]) {
                    nextValue = $(this).parent().parent().next().find('textarea').val();
                    $(this).parent().parent().next().find('textarea').val(nowValue);
                } else {
                    nextValue = $(".J_option div textarea:first").val();
                    $(".J_option div textarea:first").val(nowValue);
                }
                $(this).parent().siblings('div').children('textarea').val(nextValue);
            });
            /**添加选项**/
            $(".J_bj ").on('click','.J_choose .J_add_option',function () {
                var _length = $(this).siblings(".J_option ").find('div textarea').length;
                if (_length === 10) {
                    return
                } else {
                    var _list=_this.state.itemJson;
                    _list.push('1');
                    for(var i=0;i<_list.length;i++){
                        _list[i]=letterIndex[i]
                    }
                    _this.setState ({itemJson:_list});
                    $(this).siblings(".J_option ").find('div textarea')
                        .each(function (index) {//给每个选项编号A,B,C...
                            $(this).parent().siblings('span').text(letterIndex[index]+"：");
                        });
                }
            });
            /**选项提示语**/
            $(".J_bj").on('keyup', '.J_option textarea', function () {
                if ($.trim($(this).val()) === "") {
                    $(this).parent().siblings('.J_hint').css('visibility', 'visible');
                    $(this).css('borderColor', '#FF4141');
                } else {
                    $(this).parent().siblings('.J_hint').css('visibility', 'hidden');
                    $(this).css('borderColor', '#cccccc');
                }
                var _J_hint=$(this).parentsUntil('.J_bj').last();
                var _color=true;
                _J_hint.find('.J_hint').each(function () {
                    if($(this).css('visibility')==='visible'){
                        _color=false;
                    }
                });
                if(_color){
                    _J_hint.css('borderColor','#2F82FF');
                }
            });
            /***题干提示**/
            $('.J_bj ').on('keyup', '.J_topic textarea', function () {
                if ($.trim($(this).val()) === "") {
                    $(this).parent().siblings('.J_hint').css('visibility', 'visible');
                    $(this).css('borderColor', '#FF4141');
                } else {
                    $(this).parent().siblings('.J_hint').css('visibility', 'hidden');
                    $(this).css('borderColor', '#cccccc');
                }
                var _J_hint=$(this).parentsUntil('.J_bj').last();
                var _color=true;
                _J_hint.find('.J_hint').each(function () {
                    if($(this).css('visibility')==='visible'){
                        _color=false;
                    }
                });
                if(_color){
                    _J_hint.css('borderColor','#2F82FF');
                }
            });
            /**答案提示语**/
            $(".J_bj").on('change', '.J_key input', function () {
                var _length = $(this).parent().parent().parent().find('input:checked').length;
                if (_this.state.problemType === '1') {//如果是多选题，答案只有一个，则提示错误信息
                    if (_length < 2) {
                        $(this).parent().parent().siblings('.J_hint').css('visibility', 'visible');
                        $(this).css('borderColor', '#FF4141');
                    } else {
                        $(this).parent().parent().siblings('.J_hint').css('visibility', 'hidden');
                        $(this).css('borderColor', '#cccccc');
                    }
                } else {
                    if (_length < 1) {
                        $('.J_key .J_hint').css('visibility', 'visible');
                        $(this).css('borderColor', '#FF4141');
                    } else {
                        $('.J_key .J_hint').css('visibility', 'hidden');
                        $(this).css('borderColor', '#cccccc');
                    }
                }
                var _J_hint=$(this).parentsUntil('.J_bj').last();
                var _color=true;
                _J_hint.find('.J_hint').each(function () {
                    if($(this).css('visibility')==='visible'){
                        _color=false;
                    }
                });
                if(_color){
                    _J_hint.css('borderColor','#2F82FF');
                }
            });
            /***新增一题**/
            $('.J_bj').on('click', '.J_add_titles', function () {
                var _arr=_this.state.list;
                var _prevIndex=$(".J_bj>div").index($('.J_open'));
                if(_prevIndex!==-1) {//修改完后，点击新增，刷新保存的类容
                    var itemList=[];
                    $('.J_bj>div.J_open').find('.J_option textarea').each(function (index) {
                        var item = {};
                        item.itemIndex = index;//序号、排序
                        item.numberIndex = letterIndex[index];//序号文本
                        item.content = $(this).val();//内容
                        itemList.push(item);
                    });
                    if(_this.state.problemType==='1'){//多选的时候拿到答案
                        var _result4=[];
                        $('.J_bj>div.J_open').find('.J_key input').each(function (index) {
                            if($(this).prop('checked')){
                                var _result=$(this).parent().siblings('span').text();
                                _result4.push(_result);
                            }
                        });
                        _this.state.result=_result4;
                    }
                    _this.state.itemJson=JSON.stringify(itemList);
                    problemsQueryList[_prevIndex] = _this.state;
                    // problemsQueryList[_prevIndex].itemJson = JSON.stringify(itemList);
                }else {
                    var itemList1=[];
                    $(this).prev().find('.J_option textarea').each(function (index) {
                        var _this = $(this);
                        var item = {};
                        item.itemIndex = index;//序号、排序
                        item.numberIndex = letterIndex[index];//序号文本
                        item.content = _this.val();//内容
                        itemList1.push(item);
                    });
                    if(_this.state.problemType==='1'){//多选的时候拿到答案
                        var _result5=[]
                        $(this).prev().find('.J_key input').each(function (index) {
                            if($(this).prop('checked')){
                                var _result=$(this).parent().siblings('span').text();
                                _result5.push(_result);
                            }
                        });
                        _this.state.result=_result5;
                    }
                    _this.state.itemJson=JSON.stringify(itemList1);
                    // if($('.J_bj .J_choose').length>problemsQueryList.length){
                        problemsQueryList.push(_this.state);
                    // }
                }
                $('.J_choose').removeClass('J_open');
                _arr.push('1');
                /*******题目收起后显示的类容******/
                $('.J_title_down').css('display','block')
                    .siblings().css('display','none');
                $(this).prev().css({marginBottom:'50px'}).find('.J_title_down').css('display','block')
                    .siblings().css('display', 'none');
            //     var problemType, _html = '';
            // $(this).prev().find('.J_option textarea').each(function (i, p) {//拼接选项
            //     _html += '<div>' +
            //         '<span>' + $(this).parent().siblings('span').text() + '</span>' +
            //         '<div>' + $(this).val() + '</div>' +
            //         '</div>';
            // });
            //     $(this).prev().find('.J_title_down_option').html(_html);//选项显示到页面
            //     $(this).prev().find('.J_title_down .J_analysis div').text(_this.state.notes);//解析显示到页面
            //     $(this).prev().find('.J_title_down .J_answer_key').text(_this.state.result);//答案显示到页面
            //     if (_this.state.problemType === '0') {
            //         problemType = '单选题';
            //     } else if (_this.state.problemType === '1') {
            //         problemType = '多选题';
            //     } else {
            //         problemType = '判断题';
            //         $(this).prev().find('.J_title_down_option').remove();
            //         $(this).prev().find('.J_option').css('display','none');
            //         $(this).prev().find('.J_add_option').css('display','none');
            //         var result;
            //         if(_this.state.result==='0'){
            //             result='错';
            //         }else if(_this.state.result==='1'){
            //             result='对';
            //         }
            //         $(this).prev().find('.J_title_down .J_answer_key').text(result);//答案显示到页面
            //     }

                yanzhen();//验证
                show();//显示页面
            // $(this).prev().find('.J_title_down h4').text(_title.length + "." + problemType);//第几题
            _this.setState({//每次新增清空状态
                difficulty: '0',
                result: "",
                notes: "",
                contents: "",
                itemJson: ['A', 'B', 'C', 'D'],
                problemType: '0',
                list:_arr
            });
                $(this).prev().css('borderColor','#2F82FF');//修改边框颜色
            });
            /***题目展开**/
            $('.J_bj').on('click','.J_choose .J_title_down',function () {
                var itemList=[];
                var _prevIndex=$(".J_bj>div").index($('.J_open'));
                if(_prevIndex!==-1){
                    $('.J_open').find('.J_option textarea').each(function (index) {
                        var item = {};
                        item.itemIndex = index;//序号、排序
                        item.numberIndex = letterIndex[index];//序号文本
                        item.content = $(this).val();//内容
                        itemList.push(item);
                    });
                    // _this.state.itemJson=JSON.stringify(itemList);
                    if(_this.state.problemType==='1'){//多选的时候拿到答案
                        var _result2=[]
                        $('.J_open').find('.J_key input').each(function (index) {
                            if($(this).prop('checked')){
                                var _result=$(this).parent().siblings('span').text();
                                _result2.push(_result);
                            }
                        });
                        _this.state.result=_result2;
                    }
                    problemsQueryList[_prevIndex]=_this.state;
                    problemsQueryList[_prevIndex].itemJson=JSON.stringify(itemList);
                }else{
                    $('.J_add_titles').prev().find('.J_option textarea').each(function (index) {
                        var item = {};
                        item.itemIndex = index;//序号、排序
                        item.numberIndex = letterIndex[index];//序号文本
                        item.content =  $(this).val();//内容
                        itemList.push(item);
                    });
                    if(_this.state.problemType==='1'){//多选的时候拿到答案
                        var _result3=[]
                        $('.J_add_titles').prev().find('.J_key input').each(function (index) {
                            if($(this).prop('checked')){
                                var _result=$(this).parent().siblings('span').text();
                                _result3.push(_result);
                            }
                        });
                        _this.state.result=_result3;
                    }
                    _this.state.itemJson=JSON.stringify(itemList);
                    problemsQueryList.push(_this.state);
                }
                $(this).parent().siblings().removeClass('J_open');
                $(this).parent().addClass('J_open');//为每一个展开的题目添加一个判断class
                $('.J_title_down').css('display','block')//其他所有收起
                    .siblings().css('display','none');
                $(this).css('display','none')//自己展开
                    .siblings().css('display','block');
                var _index=$(".J_bj>div").index($(this).parent());
                // if(_index==$(".J_bj .J_choose").length){
                //      var a=JSON.parse(_nowtitle[0].itemJson);
                //     var _arr=[];//用来生成选项，答案列表
                //     for(var i=0;i<a.length;i++){
                //         _arr[i]=letterIndex[i];
                //     }
                //     this.setState({
                //         contents:_nowtitle[0].contents,
                //         difficulty:_nowtitle[0].difficulty,
                //         notes:_nowtitle[0].notes,
                //         result:_nowtitle[0].result,
                //         problemType:_nowtitle[0].problemType,
                //         itemJson:_arr
                //     },show);
                // }else{
                    var a=JSON.parse(problemsQueryList[_index].itemJson);
                    var _arr=[];//用来生成选项，答案列表
                    for(var i=0;i<a.length;i++){
                        _arr[i]=letterIndex[i];
                    }

                    _this.setState({
                        contents:problemsQueryList[_index].contents,
                        difficulty:problemsQueryList[_index].difficulty,
                        notes:problemsQueryList[_index].notes,
                        result:problemsQueryList[_index].result,
                        problemType:problemsQueryList[_index].problemType,
                        itemJson:_arr
                    });
                show();//显示收缩页面内容
                yanzhen();//验证
                if(!$(this).parent().hasClass('J_err')){
                    $(this).parent().css('borderColor','#2F82FF');
                }
                // }
                if(_this.state.problemType==='2'){
                    $(this).siblings('.J_add_option').css('display','none');
                    $(this).siblings('.J_option').css('display','none');
                    $(this).children('.J_add_down_option').css('display','none');
                }
                $(this).siblings('.J_option').find( 'textarea').each(function (i) {
                    $(this).val(a[i].content);
                });
            });

            /***收起后显示的类容**/
            function show() {
                var _length=$(".J_bj .J_choose").length;
                $(".J_bj .J_choose").each(function (i) {
                    var problemType,result,_Html='', _data;
                    _data=problemsQueryList[i];
                    if(_data.problemType!=='2'){
                        var _itemJson=JSON.parse(_data.itemJson);
                        $.each(_itemJson,function (index, p) {//拼接选项
                            _Html += '<div>' +
                                '<span>' + p.numberIndex + '</span>' +
                                '<div>' + p.content + '</div>' +
                                '</div>';
                        });
                        $(this).children('.J_title_down').find('.J_title_down_option').html(_Html);//选项显示到页面
                    }else{
                        $(this).children('.J_title_down').find('.J_title_down_option').html('');//删除选项
                    }
                    $(this).children('.J_title_down').find(' .J_analysis div').html(_data.notes);
                    $(this).children('.J_title_down').find(' .J_contents').html(_data.contents);
                    $(this).children('.J_title_down').find(' .J_answer_key').text(_data.result);
                    if (_data.problemType === '0') {
                        problemType = '单选题';
                    } else if (_data.problemType === '1') {
                        problemType = '多选题';
                    } else {
                        problemType = '判断题';
                        if (_data.result === '0') {
                            result = '错';
                        } else if(_data.result === '1'){
                            result = '对';
                        }
                        $(this).children('.J_title_down').find(' .J_answer_key').text(result);
                    }
                    $(this).children('.J_title_down').find('h4').text(i+1+'.'+problemType);
                });
            }
        }
    }
}
export default TikuAdd;